<template>
	<w-collapse v-model="collapseVisible" disabled :showArrow="false" title="基础信息">
		<el-form ref="form" :model="materialDetails" :rules="rules" size="mini" label-width="100px" inline>
			<fx-detials-form-row>
				<el-form-item slot="left" prop="code" label="物料编号：">
					<w-input
						v-model="materialDetails.code"
						:maxlength="$fxCommon.getFxInputMaxLength('commonCode')"
						:regType="$fxCommon.getFxInputReg('commonCode')"
						class="form-item-input"
					></w-input>
				</el-form-item>
				<el-form-item slot="right" prop="name" label="物料名称：">
					<w-input
						v-model="materialDetails.name"
						:maxlength="$fxCommon.getFxInputMaxLength('commonName')"
						:regType="$fxCommon.getFxInputReg('commonName')"
						class="form-item-input"
					></w-input>
				</el-form-item>
			</fx-detials-form-row>
			<fx-detials-form-row>
				<el-form-item slot="left" prop="rate" label="出成率：">
					<w-input-number
						v-model="materialDetails.rate"
						class="form-item-input"
						:pointSize="2"
					></w-input-number>%
				</el-form-item>
				<el-form-item slot="right" prop="materialSignId" label="物料单位：">
					<w-select :multiple='false' v-model="materialDetails.materialSignId" allowCreate
						:clearable='true' :collapseTags='false' :optionlist='materialSignSelectList' :isBlock='true' @blur="materialSignBlur"
						class="form-item-input"
						@change="changeUnit">
					</w-select>
				</el-form-item>
			</fx-detials-form-row>
			<fx-detials-form-row>
				<el-form-item slot="left" prop="enable" label="启停状态：">
					<el-switch v-model="materialDetails.enable" :active-value="1" :inactive-value="0"  class="form-item-input"></el-switch>
				</el-form-item>
        <el-form-item slot="right" prop="processingFlag" label="加工标识：">
					<w-select :multiple='false'
						v-model="materialDetails.processingFlag"
						:optionlist="processingFlagList"
						clearable
						class="form-item-input"
					>
					</w-select>
				</el-form-item>
			</fx-detials-form-row>
			<fx-detials-form-row>
				<el-form-item label="备注：" class="form-item-memo">
					<w-input
						v-model="materialDetails.remark"
						:maxlength="$fxCommon.getFxInputMaxLength('remark')"
						:regType="$fxCommon.getFxInputReg('remark')"
						class="form-item-input-full"
					></w-input>
				</el-form-item>
			</fx-detials-form-row>
		</el-form>
	</w-collapse>
</template>
<script>
export default {
	name: 'createMaterial',
	props: {
		visibleFlag: Boolean,
		organType: String,
		materialDetails: {
			type: Object,
			default: () => {
				return {}
			}
		},
		materialSignSelectList: {
			type: Array,
			default: () => {
				return []
			}
		},
		disabled: Boolean
	},
	data () {
		return {
			collapseVisible: true,
			rules: {
				code: [{ required: true, message: '该字段不能为空', trigger: 'change' }],
				name: [{ required: true, message: '该字段不能为空', trigger: 'change' }],
				rate: [{ required: true, message: '该字段不能为空', trigger: 'change' }],
				materialSignId: [{ required: true, message: '该字段不能为空', trigger: 'change' }],
				processingFlag: [{ required: true, message: '该字段不能为空', trigger: 'change' }]
			},
			addmaterialSign: '',
			processingFlagList: [{
				id: 0,
				name: '在制品'
			}, {
				id: 1,
				name: '产品'
			}, {
				id: 2,
				name: '原料'
			}]
		}
	},
	watch: {
		visibleFlag: {
			immediate: true,
			handler (val) {
				if (val) {
					this.refresh()
				}
			}
		}
	},
	methods: {
		changeUnit (item) {
			this.addmaterialSign = ''
			this.$emit('on-materialUnitSelect-change', item)
		},
		refresh () {
			this.$nextTick(() => {
				this.$refs.form.clearValidate()
			})
		},
		validate () {
			return this.$refs.form.validate()
		},
		checkUnitName (tableDetails) {
			return new Promise((resolve, reject) => {
				let isRepeat = false
				if (this.addmaterialSign) {
					if (tableDetails.find(d => d.busUnit === this.addmaterialSign)) {
						isRepeat = true
					}
				} else {
					const unitName = this.materialSignSelectList.find(d => d.id === this.materialDetails.materialSignId)
					if (tableDetails.find(d => d.busUnit === unitName.name)) {
						isRepeat = true
					}
				}
				if (!isRepeat) {
					resolve()
				} else {
					reject(new Error(0))
				}
			})
		},
		materialSignBlur (e, value) {
			if (value) {
				this.addmaterialSign = value
				this.$emit('on-materialUnit-change', value)
			}
		}
	}
}
</script>
<style lang="stylus" scoped>
@import '~$assets/stylus/varsty.styl'
.form-item-input {
	width: 275px
	box-sizing: border-box
}
.form-item-input-full {
	width:755px
}
.form-item-input-buyer {
	width: 220px
}
.form-item-memo {
	>>>.el-form-item__label {
		padding-left:10px
	}
}
</style>
